*{
    padding: 0;
    margin: 0;
    list-style: none;
}
html,body{
    width: 100%;
    height: 100%;
}
.box{
    width: 100%;
    height: 100%;
    /* background-color: pink; */
}
.header{
    width: 100%;
    height: 0.8rem;
    background-color: red;   
    text-align: center;
    >span{
        display: block;
        width: 0.8rem;
        height: 0.8rem;
        float: left;
        line-height: 0.8rem;
        font-size: 0.4rem;
        color: white;
    }
    h4{
        float: right;
        margin-right: 50%;
        transform:translate(50%);
        height: 100%;
        line-height: 0.8rem;
        font-weight: 400;
        font-size: 0.4rem;
        color: white;
    }
}
.picture{
    box-sizing: border-box;
    width: 100%;
    height: 3.56rem;
    background-color: skyblue;
    padding-top: 0.4rem;
    .picture-in{
        position: relative;
        width: 100%;
        height: 1.55rem;
        // background-color: pink;
        .baiyi{
            float: left;
            display: block;
            width: 1.55rem;
            height: 1.55rem;
            background-image: url('./images/shop_logo.png');
            background-size: cover;
        }
        .vip,.Ag,.san{
            position: absolute;
            font-size: 0.3rem;
            bottom: 0.2rem;
            width: 0.3rem;
            height: 0.3rem;
            border-radius: 0.05rem;
            background-color:red;
            img{
                width: 100%;
                height: 100%;
            }
        }
        .vip{
            left: 1.81rem;
        }
        .Ag{
            left: 2.17rem;
        }
        .san{
            left: 2.53rem;
        }
        h5{
            position: absolute;
            top: 0.2rem;
            left: 1.81rem;;
            font-size: 0.2rem;
            font-weight: 400;
            color: white;
        }
        .right{
            position: absolute;
            font-size:0.4rem;
            right: 0;
            top:50%;
            transform: translateY(-50%);
            width: 0.4rem;
            height: 0.4rem;
        }
    }
    .list{
        box-sizing: border-box;
        margin-top: 0.77rem;
        padding-top: 0.1rem;
        width: 100%;
        font-size: 0.2rem;
        height: 0.84rem;
        color: lightgray;
        background-color: rgba(0, 0, 0,.3);
        >.list-in{
            li{
                
                box-sizing: border-box;
                width: 33.33%;
                height: 0.64rem;
                float: left;
                span{
                    display: block;
                    width: 100%;
                    height: 0.32rem;
                    line-height: 0.32rem;
                    text-align: center;
                }
                &:nth-of-type(2){
                    border-right: 2px solid white;
                    border-left: 2px solid white;

                }              
            }
        }
    }
}
.nav{
    overflow: hidden;
    border-bottom: 5px solid gray;
    ul{
        li{
            box-sizing: border-box;
            width: 33.33%;
            float: left;
            font-size: 0.3rem;
            text-align: center;
            h5{
                color: gray;
                font-weight: 400;
            }
            &:nth-of-type(-n+6){
                border-bottom: 1px solid gray;
            }
            &:nth-of-type(3n+2){
                border-right: 1px solid gray;
                border-left: 1px solid gray;
            }
        }
    }
}
.by{
    width: 100%;
    height: 1.5rem;
    border-bottom: 5px solid gray;
}
.footer{
    width: 100%;
    // height: 0.6rem;
   
    ul{
        overflow: hidden;
    }
    li{
        float: left;
        width: 25%;
        padding-bottom: 0.08rem;
        box-sizing: border-box;
        text-align: center;
        color: gray;
        font-size: 0.5rem;
        span{
            font-size: 0.32rem;
        }
        h6{
            font-size: 0.2rem;
            font-weight: 400;
        }
    }
}